<template>
<div class="app-container">
  <el-form ref="eForm" label-position="right" label-width="180px" :model="eForm" :rules="rules">
    <!-- 员工id，新建的时候为空 -->
    <el-input type="hidden" v-model="eForm.eno"></el-input>

    <el-form-item label="员工姓名：" prop="ename">
      <el-col :span="3">
        <el-input v-model="eForm.ename"></el-input>
      </el-col>
    </el-form-item>

    <el-form-item label="员工性别：">
      <el-radio-group v-model="eForm.esex">
        <el-radio label="1">男</el-radio>
        <el-radio label="2">女</el-radio>
      </el-radio-group>
    </el-form-item>

    <el-form-item label="员工生日：" prop="ebirth">
      <el-date-picker type="date" placeholder="选择日期" v-model="eForm.ebirth"></el-date-picker>
    </el-form-item>

    <el-form-item label="入职时间：" prop="hiredate">
      <el-date-picker type="date" placeholder="选择日期" v-model="eForm.hiredate"></el-date-picker>
    </el-form-item>

    <el-form-item label="文化程度：" prop="standard_culture">
      <el-col :span="10">
        <el-input v-model="eForm.standard_culture"></el-input>
      </el-col>
    </el-form-item>

    <el-form-item label="电话：" prop="phone">
      <el-col :span="10">
        <el-input v-model="eForm.phone"></el-input>
      </el-col>
    </el-form-item>

    <el-form-item label="民族：" prop="nation">
      <el-col :span="10">
        <el-input v-model="eForm.nation"></el-input>
      </el-col>
    </el-form-item>
    
    <el-form-item label="专业：" prop="major">
      <el-col :span="10">
        <el-input v-model="eForm.major"></el-input>
      </el-col>
    </el-form-item>
    
    <el-form-item label="职务：" prop="duty">
      <el-col :span="10">
        <el-input v-model="eForm.duty"></el-input>
      </el-col>
    </el-form-item>

    <el-form-item label="政治面貌：" prop="political">
      <el-col :span="10">
        <el-input v-model="eForm.political"></el-input>
      </el-col>
    </el-form-item>

    <el-form-item label="婚姻状况：" prop="marriage">
      <el-col :span="10">
        <el-input v-model="eForm.marriage"></el-input>
      </el-col>
    </el-form-item>

    <el-form-item label="">
      <el-button type="success" size="medium" icon="el-icon-edit" @click="handleCreate">
        保存
      </el-button>
    </el-form-item>
  </el-form>
</div>
</template>

<script>
import { addEmployees } from '@/api/employees'

export default {
  data() {
    return {
      eForm: {
        eno: this.$route.params.eno,    // 上一页面传过来的员工号
      },

      rules: {
        ename: [
          { required: true, message: '请输入姓名', trigger: 'blur' },
          { min: 2, max: 10, message: '长度在 2 到 10 个字符', trigger: 'blur' }
        ],
        ebirth: [
          { required: true, message: '请选择生日', trigger: 'blur' },
        ],
        hiredate: [
          { required: true, message: '请选择入职时间', trigger: 'blur' },
        ]
      }
    }
  },

  methods: {
    handleCreate() {
      console.log('create')
      this.$refs['eForm'].validate((valid) => {

        console.log('valid')
        if (!valid) return false;

        addEmployees(this.eForm).then(response => {
          if (response.data.code != 200) {
            this.$notify({
              title: '保存失败！',
              message: response.data.message,
              type: 'error'
            });
          } else {
            this.$store.dispatch('delVisitedViews', this.$route)
            this.$router.go(-1)
            this.$notify({
              title: '成功',
              message: '保存成功！',
              type: 'success'
            });
          }
        });
      });
    },
  }
}
</script>

<style lang="sass" scoped>

</style>
